<!DOCTYPE html>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="contextPath" value="${pageContext.request.contextPath}" />
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>添加用户</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<meta content="width=device-width, initial-scale=1" name="viewport">
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrapValidator.min.css" />
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" type="text/css" href="${contextPath}/css/public.css">
<script type="text/javascript" src="${contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${contextPath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${contextPath}/js/common.js"></script>
<script type="text/javascript" src="${contextPath}/js/bootstrapValidator.min.js"></script>
<script type="text/javascript" src="${contextPath}/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="${contextPath}/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<body>
	<div class="container">
		<div style="padding: 50px 100px 10px;">
			<!-- form: -->
			<section>
				<form action="${contextPath}/security/updateCustomer" method="post" id="updateCustomer" name="updateCustomer" role="form" class="form-horizontal">
					<input type="text" class="form-control hidden" name="id" id="id" value="${requestScope.id}">
					<input type="text" class="form-control hidden" name="typeSelect" id="typeSelect" value="${requestScope.type}">
					<div class="form-group">
						<!-- 类型 -->
						<div class="input-group">
							<span class="input-group-addon">
								<strong>客户类型</strong>
								<span class="text-danger">*</span>
							</span>
							<select class="form-control" id="type" name="type" onchange="typeChange()">
								  <c:if test="${requestScope.type=='个人'}">
								 	 <option value="个人" selected="selected">个人</option>
								 	 <option value="企业" >企业</option>
								  </c:if>
								  <c:if test="${requestScope.type=='企业'}">
								   	 <option value="个人" >个人</option>
								 	 <option value="企业" selected="selected">企业</option>
								  </c:if>
								  <!--  
									<option value="个人" <c:if test="${requestScope.type=='个人'}"> selected="selected"</c:if>>个人</option>
									<option value="企业" <c:if test="${requestScope.type=='企业'}"> selected="selected"</c:if>>企业</option>
									-->
									
							</select>
						</div>
					</div>
					<div class="form-group" id="companyType" style="display: none">
						<!-- 公司名称 -->
						<div class="input-group">
							<span class="input-group-addon">
								<strong>公司名称</strong>
								<span class="text-danger">*</span>
							</span>
							<input type="text" class="form-control" name="company" id="company" value="${requestScope.company}" placeholder="公司名称" autocomplete="off">
						</div>
					</div>
					<div class="form-group">
						<!-- 客户名称 -->
						<div class="input-group">
							<span class="input-group-addon">
								<strong>客户姓名</strong>
								<span class="text-danger">*</span>
							</span>
							<input type="text" class="form-control text-danger" name="name" id="name" value="${requestScope.name}" maxlength="30" placeholder="联系人/负责人/对接人" autocomplete="off">
						</div>
					</div>

					<div class="form-group">
						<!-- 联系方式 -->
						<div class="input-group">
							<span class="input-group-addon">
								<strong>联系电话</strong>
								<span class="text-danger">*</span>
							</span>
							<input type="text" class="form-control" name="telephone" id="telephone" value="${requestScope.telephone}" maxlength="20" placeholder="电话" autocomplete="off">
						</div>
					</div>
					<div class="form-group">
						<c:if test="${sessionScope.usertype!=2}">
							<button type="submit" class="btn btn-success btn-block" id="add">保存</button>
						</c:if>
					</div>
				</form>
			</section>
			<!-- :form -->
		</div>
	</div>
	<script type="text/javascript">
		var typeChange = function() {
			var t = $("#type").val();
			if (t == "个人") {
				$("#companyType").hide();
			}
			if (t == "企业") {
				$("#companyType").show();
			}
		}
		$(document).ready(function() {
			var ts = $("#typeSelect").val();
			if (ts == '企业') {
				$("#companyType").show();
			}
			$('.form_date').datetimepicker({
				language : 'zh-CN',
				linkField : "salesTime",
				endDate : new Date(),
				initialDate : new Date(),
				weekStart : 0,
				todayBtn : 1,
				autoclose : 1,
				startView : 2,
				minView : 2
			});
			$('.form_dater').datetimepicker('show');

			$("#close").click(function() {
				window.close();
			});
			//==================================================================================================================
			$('#updateCustomer').bootstrapValidator({
				live : 'enabled',
				submitButtons : 'button[type="submit"]',
				message : 'This value is not valid',
				feedbackIcons : {
					valid : 'glyphicon glyphicon-ok',
					invalid : 'glyphicon glyphicon-remove',
					validating : 'glyphicon glyphicon-refresh'
				},
				fields : {
					name : {
						validators : {
							notEmpty : {
								message : '客户名称不能为空'
							},
							stringLength : {
								min : 0,
								max : 30,
								message : '客户名称不能超过30个汉字'
							}
						}
					},
					card : {
						validators : {
							notEmpty : {
								message : '会员号不能为空,会员号为手机号'
							},
							stringLength : {
								max : 11,
								message : '会员号为手机号，不能超过11位'
							}
						}

					}
				}
			});

			//$('#addCustomer').bootstrapValidator();
			$('#add').click(function() {
				var bootstrapValidator = $('#updateCustomer').data('bootstrapValidator');
				//手动触发验证
				bootstrapValidator.validate();
				if (bootstrapValidator.isValid()) {
					//表单提交的方法、比如ajax提交
					updateCustomer.submit();
				}

			});
		});
	</script>
</body>
</html>

